import React from 'react';

export default class practise extends React.Component {

    state = {
        value:'',
        list:[]
    };
    idCount = 1;
    onInput(){
        this.setState({
            inputValue:e.targe.value,
        })
    }
    onAdd(){
        this.setState({
            list:this.state.list.concat({
                id:this.idCount++,
                value:this.state.Value,
            })
        })
    }
    onRemove(){
        this.setState({
            list:this.state.list.filter(item => item.id!==id)
        })
    }
    render() {
        return (
            <div>
                <input
                    type="text"
                    value={this.state.value}
                    onInput={this.onInput.bind(this)}
                 />
                 <button onClick={this.onAdd.bind(this)}>增加</button>
                 <ol>
                    {
                        this.state.list.map(item => (
                            <li key={item.id}>
                                {item.value}
                                <button onClick={ ()=> this.onRemove.call(this,e,item.id)}>删除</button>
                            </li>
                        ))
                    }
                 </ol>
            </div>
        );
    }

}
